<style scoped>
  .page {
    text-align: right;margin-top: 10px
  }
  .layout{
    background: #f5f7f9;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
  }
  .demo-spin-icon-load{
    animation: ani-demo-spin 1s linear infinite;
  }
  .demo-spin-col{
    height: 100px;
    position: relative;
  }
  .mb20 {
    margin-bottom: 20px;
  }
  .layout-logo{
    width: 110px;
    height: 30px;
    background: #5b6270;
    border-radius: 3px;
    float: left;
    position: relative;
    top: 0px;
    left: 0px;
  }
  .layout-nav{
    width: 420px;
    margin: 0 auto;
    margin-right: 20px;
  }
  .layout-footer-center{
    text-align: center;
  }
  .content{
    height: auto;
    background-color:white;
    padding-left: 30px;
    padding-right: 30px;
  }
  .item1{
    height:40px;
    line-height:50px
  }
  .info{
    height: auto;
    background-color:#F8F8FF;
    padding-left: 70px;
    padding-right: 70px;
  }
  .header{
    height: 40px;
    background-color: white;
    line-height: 40px;
    border-bottom: 1px solid orangered;
  }
  .info-middle{
    height: 375px;
    background-color: #F8F8FF;
    padding-left: 70px;
    padding-right: 70px;
    padding-bottom: 15px;
  }
  .titles{
    height: 35px;
    background-color: black;
    line-height: 35px;
    font-size: 1rem;
    color: white;
    padding-left: 10px;
  }
  .nopadding .ivu-table-cell {
    padding: 0px 0px;
  }
  .head_btn {
    height:45px;
    line-height:45px;
    width: 130px;
    float: left;
    margin-right: 20px;
  }
  .subsidy-img {
    height: 140px;
    width: 120px;
    position: absolute;
    right: 8%;
    top: 11%;
  }
  .red_color {
    color: red;
    font-size: 15px;
  }
  .ivu-modal-header{
    border-bottom: none;
  }
  .ivu-modal-footer{
    border-top: none;
  }
  .planning-details{
    line-height: 45px;
    margin-left: 70px;
  }
  .demo-upload-list{
    display: inline-block;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    border: 1px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0,0,0,.2);
    margin-right: 4px;
  }
  .demo-upload-list img{
    width: 100%;
    height: 100%;
  }
  .demo-upload-list-cover{
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.6);
  }
  .demo-upload-list:hover .demo-upload-list-cover{
    display: block;
  }
  .demo-upload-list-cover i{
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    margin: 0 2px;
  }
  .active-img img{
    margin-top: 10px;
    width: 200px;
    height: 200px;
  }
  .out-row{
    margin-bottom: 200px;
  }
  .ivu-table-overflowX{
    overflow-x:hidden
  }
  .ivu-table-tip{
    overflow-x: hidden;
  }
</style>
<template>
  <div>
    <Tabs value="name1" @on-click="changeTab" v-model="tab_index">
      <TabPane :label="'活动计划'" name="0" >
        <span style="margin-left: 20px">活动主题：</span>
        <Input v-model="QueryByActivitySubject" placeholder="请输入活动主题" style="width: 150px" />
        <Button type="info" style="margin-left: 20px"  @click="selectPlan(QueryByActivitySubject)"><Icon type="ios-search" />搜索</Button>
        <Button type="primary" style="margin-left: 20px"  @click="add()"><Icon type="md-add"/>添加</Button>
        <div style="margin-top: 20px">
          <Table border :columns="columns1" :data="datalist1">
            <template slot-scope="{ row, index }" slot="action">
              <Button type="primary" size="small" style="margin-right: 5px" @click="edit(row,index)">编辑</Button>
              <Button type="success" size="small" style="margin-right: 5px" @click="addPlanningButton(row)">添加策划</Button>
              <Button type="warning" size="small" @click="select(row)">查看详情</Button>
            </template>
          </Table>
        </div>
        <div  class="page">
          <Page :total="totalnum" :current="currentpageNo" :page-size="currentpageSize" @on-change="change" class="page_style"/>
        </div>
      </TabPane>
      <TabPane :label="'活动策划'" name="1" >
        <span style="margin-left: 20px">活动地点：</span><Input v-model="searchParam.activity_place" placeholder="请输入活动地点" style="width: 150px" />
        <span style="margin-left: 20px">活动时间：</span>
        <DatePicker v-model="searchParam.activity_time" type="date" placeholder="请选择时间" placement="bottom-end" style="width: 200px"></DatePicker>
        <Button type="info" style="margin-left: 20px" @click="selectPlanning(searchParam)"><Icon type="ios-search" />搜索</Button>
        <Button type="success" style="margin-left: 20px"  @click="addPlanning()"><Icon type="md-add"/>添加</Button>
        <div style="margin-top: 20px">
          <Table border :columns="columns2" :data="datalist2">
            <template slot-scope="{row,index}" slot="state">
              <template  v-if="row.state==='0'">未开启</template>
              <template v-if="row.state==='1'">开启</template>
              <template  v-if="row.state==='2'">结束</template>
            </template>
            <template slot-scope="{row,index}" slot="activity_state">
              <template  v-if="row.activity_state==='0'">未总结</template>
              <template v-if="row.activity_state==='1'">已总结</template>
            </template>
            <template slot-scope="{ row, index }" slot="action">
              <template v-if="row.state==='0'">
                <Button type="primary" size="small" style="margin-right: 5px" @click="editPlanning(row,index)">编辑</Button>
                <Button type="success" size="small" @click="Implement(row)" style="margin-right: 5px">执行</Button>
              </template>
              <template v-if="row.state==='1'">
                <Button type="error" size="small" @click="EndOfActivity(row)" style="margin-right: 5px">结束</Button>
                <Button type="warning" size="small" @click="ViewPlanningDetails(row)">查看详情</Button>
              </template>
              <template v-if="row.state==='2'&&row.activity_state==='0'">
                <Button type="primary" size="small" @click="planningDetails(row)" style="margin-right: 5px">总结</Button>
                <Button type="warning" size="small" @click="ViewSummaryDetails(row)">总结详情</Button>
              </template>
              <template v-if="row.state==='2'&&row.activity_state==='1'">
                <Button type="warning" size="small" @click="ViewAllDetails(row)">查看详情</Button>
              </template>
            </template>
          </Table>
        </div>
        <div  class="page">
          <Page :total="totalnum2" :current="currentpageNo" :page-size="currentpageSize" @on-change="changeAgent" class="page_style"/>
        </div>
      </TabPane>
    </Tabs>
    <Modal v-model="addEditModal" :title="modalTitle" width="700">
      <Form :model="formItem" :label-width="80" :rules="ruleValidate">
        <template v-if="modalTitle === '添加活动计划'"></template>
        <template v-if="modalTitle === '编辑活动计划'"></template>
        <FormItem label="活动主题" prop="activity_theme">
          <Input v-model="formItem.activity_theme" style="width:300px" placeholder="请输入主题"></Input>
        </FormItem>
        <FormItem label="活动目的" prop="activity_objective">
          <Input v-model="formItem.activity_objective" style="width:300px" placeholder="请输入活动目的"></Input>
        </FormItem>
        <FormItem label="活动要求" prop="activity_requirement">
          <Input v-model="formItem.activity_requirement" style="width:300px" placeholder="请输入活动要求"></Input>
        </FormItem>
        <FormItem label="活动内容" prop="activity_content">
          <Input v-model="formItem.activity_content" type="textarea" :rows="4" placeholder="请输入活动内容" ></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="error" @click="addEditModal=false">取消</Button>
        <Button type="success" @click="handleSubmit()">保存</Button>
      </div>
    </Modal>
    <Modal v-model="addEditPlanning" :title="modalPlanning">
      <Form :model="formItemPlanning" :label-width="100" :rules="rulePlanning" >
        <template v-if="modalPlanning==='添加活动策划'"></template>
        <template v-if="modalPlanning==='修改活动策划'"></template>
        <FormItem label="活动主题" prop="plan_id">
          <Select v-model="formItemPlanning.plan_id" style="width:200px">
            <Option v-for="item in PlanList" :value="item.id" :key="item.id">{{ item.activity_theme }}</Option>
          </Select>
        </FormItem>
        <FormItem label="活动时间" prop="activity_time">
          <DatePicker  v-model="formItemPlanning.activity_time" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="请选择日期时间"
                       style="width: 200px"></DatePicker>
        </FormItem>
        <FormItem label="活动地点" prop="activity_place">
          <Input v-model="formItemPlanning.activity_place" style="width:300px" placeholder="请输入活动地点"></Input>
        </FormItem>
        <FormItem label="活动措施" prop="emergency_measure">
          <Input v-model="formItemPlanning.emergency_measure" style="width:300px" placeholder="请输入应急措施"></Input>
        </FormItem>
        <FormItem label="参与人员范围" prop="objectList">
          <Select v-model="objectList" multiple style="width:300px">
            <Option v-for="item in PersonList" :value="item.value" :key="item.value">{{ item.label }}</Option>
          </Select>
        </FormItem>
        <FormItem label="活动策划流程" prop="activity_flow">
          <Input v-model="formItemPlanning.activity_flow" type="textarea" :rows="4" ></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="error" @click="addEditPlanning=false">取消</Button>
        <Button type="success" @click="handleSubmitPlanning()">保存</Button>
      </div>
    </Modal>
    <Modal v-model="viewDetails" title="活动详情" width="700">
      <div class="planning-details">
        <Row>
          <Col span="4">活动主题</Col>
          <Col span="12"> <Input v-model="formItem.activity_theme" style="width:300px" disabled></Input></Col>
        </Row>
        <Row>
          <Col span="4">活动目的</Col>
          <Col span="10"><Input v-model="formItem.activity_objective" style="width:300px" disabled></Input>
          </Col>
        </Row>
        <Row>
          <Col span="4">活动要求</Col>
          <Col span="12"><Input v-model="formItem.activity_requirement" style="width:300px" disabled></Input>
          </Col>
        </Row>
        <Row>
          <Col span="4">活动内容</Col>
          <Col span="12"><Input v-model="formItem.activity_content" type="textarea" :rows="4" disabled></Input>
          </Col>
        </Row>
      </div>
      <div slot="footer">
        <Button type="error" @click="viewDetails=false">关闭</Button>
      </div>
    </Modal>
    <Modal v-model="viewDetailsPlanning" title="活动总结" width="700">
      <Form :model="formSummary">
        <FormItem label="总结活动过程" prop="activity_process">
          <Input v-model="formSummary.activity_process" type="textarea" :rows="4" style="width:300px" placeholder="总结过程"></Input>
        </FormItem>
        <FormItem label="上传活动图片" prop="activity_img">
          <div class="demo-upload-list" :key="index" v-for="(item, index) in uploadList">
            <template v-if="item.status === 'finished'">
              <img :key="index" :src="item.url">
              <div class="demo-upload-list-cover">
                <Icon type="ios-eye-outline" @click.native="handleView(item.name)"></Icon>
                <Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon>
              </div>
            </template>
            <template v-else>
              <Progress v-if="item.showProgress" :percent="item.percentage" hide-info></Progress>
            </template>
          </div>
          <Upload
            ref="upload"
            :show-upload-list="false"
            :on-success="handleSuccess"
            :format="['jpg','jpeg','png']"
            :max-size="2048"
            :on-format-error="handleFormatError"
            :on-exceeded-size="handleMaxSize"
            :before-upload="handleBeforeUpload"
            type="drag"
            action="//dlqt.juyouhx.com/Api/Api/ObjectToOss"
            style="display: inline-block;width:58px;">
            <div style="width: 58px;height:58px;line-height: 58px;">
              <Icon type="ios-camera" size="20"></Icon>
            </div>
          </Upload>
          <Modal title="查看图片" v-model="visible">
            <img :src="'https://skv4.oss-cn-hangzhou.aliyuncs.com/app/doc/' + activity_img" v-if="visible"
                 style="width: 100%">
          </Modal>
        </FormItem>
        <FormItem label="活动参与度" prop="activity_participation">
          <Input v-model="formSummary.activity_participation" style="width:300px" placeholder="参与度"></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="error" @click="viewDetailsPlanning=false">取消</Button>
        <Button type="primary" @click="SaveActivityDetail(formSummary)">保存</Button>
        <Button type="success" @click="submitSummary(formSummary)">提交</Button>
      </div>
    </Modal>
    <Modal v-model="AllDetailsInfo" title="查看活动策划详情" width="900" >
      <div class="out-row">
        <Row>
          <Col span="8">
            <Row class="item1">
              <Col span="6">活动时间</Col>
              <Col span="12">
                <DatePicker  v-model="formItemPlanning.activity_time" format="yyyy-MM-dd HH:mm" type="datetime" disabled ></DatePicker>
              </Col>
            </Row>
          </Col>
          <Col span="8">
            <Row class="item1">
              <Col span="6">活动地点</Col>
              <Col span="12">
                <Input v-model="formItemPlanning.activity_place" disabled></Input>
              </Col>
            </Row>
          </Col>
          <Col span="8">
            <Row class="item1">
              <Col span="6">活动措施</Col>
              <Col span="12">
                <Input v-model="formItemPlanning.emergency_measure" disabled></Input>
              </Col>
            </Row>
          </Col>
        </Row>
        <Row>
          <Col span="12">
            <Row class="item1">
              <Col span="4">参与人员</Col>
              <Col span="12">
                <Input v-model="formItemPlanning.activity_object" multiple style="width:300px" disabled>
                </Input>
              </Col>
            </Row>
          </Col>
          <Col span="12">
            <Row class="item1">
              <Col span="4">参与度</Col>
              <Col span="12">
                <Input v-model="formSummary.activity_participation" multiple style="width:300px " disabled>
                </Input>
              </Col>
            </Row>
          </Col>
        </Row>
        <Row>
          <Col span="12">
            <Row class="item1">
              <Col span="4">活动流程</Col>
              <Col span="12">
                <Input v-model="formItemPlanning.activity_flow" type="textarea" multiple style="width:300px" disabled>
                </Input>
              </Col>
            </Row>
          </Col>
          <Col span="12">
            <Row class="item1">
              <Col span="4">活动总结</Col>
              <Col span="12">
                <Input v-model="formSummary.activity_process" type="textarea" multiple style="width:300px" disabled>
                </Input>
              </Col>
            </Row>
          </Col>
        </Row>
        <Row class="item1">
          <Col span="2">活动图片</Col>
          <Col span="12" class="active-img">
            <img :src="this.formSummary.activity_img" width="100%"/>
          </Col>
        </Row>
      </div>
      <div slot="footer">
        <Button type="error" @click="AllDetailsInfo=false">关闭</Button>
      </div>
    </Modal>
    <Modal v-model="PlanningDetails" title="活动策划详情" width="700">
      <div class="planning-details">
        <Row>
          <Col span="4">活动时间</Col>
          <Col span="12"><DatePicker  v-model="formItemPlanning.activity_time" disabled type="datetime" format="yyyy-MM-dd HH:mm" style="width: 200px"></DatePicker></Col>
        </Row>
        <Row>
          <Col span="4">活动地点</Col>
          <Col span="10"><Input v-model="formItemPlanning.activity_place" disabled style="width:300px"></Input>
          </Col>
        </Row>
        <Row>
          <Col span="4">活动措施</Col>
          <Col span="12"> <Input v-model="formItemPlanning.emergency_measure" disabled style="width:300px"></Input>
          </Col>
        </Row>
        <Row>
          <Col span="4">参与人员范围</Col>
          <Col span="12">
            <Select v-model="formItemPlanning.activity_object" disabled  multiple style="width:300px">
              <Option v-for="item in PersonList" :value="item.value" :key="item.value">{{ item.label }}</Option>
            </Select>
          </Col>
        </Row>
        <Row>
          <Col span="4">活动策划流程</Col>
          <Col span="12"><Input v-model="formItemPlanning.activity_flow" disabled type="textarea" :rows="4" ></Input>
          </Col>
        </Row>
      </div>
      <div slot="footer">
        <Button type="error" @click="PlanningDetails=false">关闭</Button>
      </div>
    </Modal>
    <Modal v-model="SummaryDetails" title="活动总结详情" width="700">
      <div class="planning-details">
        <Row>
          <Col span="4">总结活动过程</Col>
          <Col span="12">
            <Input v-model="formSummary.activity_process" type="textarea" :rows="4" style="width:300px" disabled></Input>
          </Col>
        </Row>
        <Row>
          <Col span="4">活动图片</Col>
          <Col span="12" class="active-img">
            <img :src="this.formSummary.activity_img" width="100%"/>
          </Col>
        </Row>
        <Row>
          <Col span="4">活动参与度</Col>
          <Col span="12">
            <Input v-model="formSummary.activity_participation" style="width:300px" disabled></Input>
          </Col>
        </Row>
      </div>
      <div slot="footer">
        <Button type="error" @click="SummaryDetails=false">关闭</Button>
      </div>

    </Modal>
    <Modal v-model="addModalPlanning" title="添加活动策划" width="700">
      <Form :model="formItemPlanning" :label-width="100" :rules="rulesPlanningButton">
        <FormItem label="活动主题" prop ="activity_theme">
          <Input v-model="formItem.activity_theme" style="width:300px"></Input>
        </FormItem>
        <FormItem label="活动时间" prop="activity_time">
          <DatePicker  v-model="formItemPlanning.activity_time" type="datetime" format="yyyy-MM-dd HH:mm" placeholder="请选择日期时间"
                       style="width: 200px"></DatePicker>
        </FormItem>
        <FormItem label="活动地点" prop="activity_place">
          <Input v-model="formItemPlanning.activity_place" style="width:300px" placeholder="请输入活动地点"></Input>
        </FormItem>
        <FormItem label="活动措施" prop="emergency_measure">
          <Input v-model="formItemPlanning.emergency_measure" style="width:300px" placeholder="请输入应急措施"></Input>
        </FormItem>
        <FormItem label="参与人员范围" prop="activity_object">
          <Select v-model="formItemPlanning.objectList" multiple style="width:300px">
            <Option v-for="item in PersonList" :value="item.value" :key="item.value">{{ item.label }}</Option>
          </Select>
        </FormItem>
        <FormItem label="活动策划流程" prop="activity_flow">
          <Input v-model="formItemPlanning.activity_flow" type="textarea" :rows="4" ></Input>
        </FormItem>
      </Form>
      <div slot="footer">
        <Button type="error" @click="addEditPlanning=false">取消</Button>
        <Button type="success" @click="savePlanning()">保存</Button>
      </div>
    </Modal>
  </div>
</template>
<script>
import { getActivityPlanList, addEditActivityPlan, getActivityTheme, findThemeList, addPlanningButton } from '@/api/activity'
import { getActivityPlanningList, addEditActivityPlanning, getActivityPlaceList, updatePlanningState, updateActivityPlanning } from '@/api/activityPlanning'
import { getActivityPlanning, SaveActivitySummary, getActivitySummaryList } from '@/api/activitySummary'
import { date0str, date2str } from '@/api/eventlist'
export default {
  data () {
    return {
      modalTitle: '',
      modalPlanning: '',
      SummaryDetails: false,
      PlanningDetails: false,
      QueryByActivitySubject: '',
      /* activity_content: '', */
      addModalPlanning: false,
      ruleValidate: {
        activity_theme: [{
          required: true, message: '主题不能为空', trigger: 'blur'
        }],
        activity_objective: [{
          required: true, message: '目的不能为空', trigger: 'blur'
        }],
        activity_requirement: [{
          required: true, message: '要求不能为空', trigger: 'blur'
        }],
        activity_content: [{
          required: true, message: '内容不能为空', trigger: 'blur'
        }]
      },
      rulePlanning: {
        plan_id: [{
          required: true, message: '请选择活动计划', trigger: 'blur'
        }],
        /*     activity_time: [{
            required: true, message: '请选择时间', trigger: 'blur'
          }], */
        activity_place: [{
          required: true, message: '活动地点不能为空', trigger: 'blur'
        }],
        emergency_measure: [{
          required: true, message: '活动措施不能为空', trigger: 'blur'
        }],
        objectList: [{
          required: true, message: '请选择人员范围', trigger: 'blur'
        }],
        activity_flow: [{
          required: true, message: '活动流程不能为空', trigger: 'blur'
        }]
      },
      rulesPlanningButton: {
        /*   activity_time: [{
            required: true, message: '请选择时间', trigger: 'blur'
          }], */
        activity_place: [{
          required: true, message: '活动地点不能为空', trigger: 'blur'
        }],
        emergency_measure: [{
          required: true, message: '活动措施不能为空', trigger: 'blur'
        }],
        activity_object: [{
          required: true, message: '参与人员不能为空', trigger: 'blur'
        }],
        activity_flow: [{
          required: true, message: '活动流程不能为空', trigger: 'blur'
        }]
      },
      formItem: {
        pageNo: 1,
        pageSize: 10,
        activity_theme: '',
        activity_objective: '',
        activity_requirement: '',
        activity_content: ''
      },
      id: '',
      ids: '',
      formItemPlanning: {
        pageNo: 1,
        pageSize: 10,
        plan_id: '',
        activity_time: '',
        activity_place: '',
        activity_object: '',
        emergency_measure: '',
        activity_flow: '',
        state: ''
      },
      formSummary: {
        planning_id: '',
        activity_process: '',
        activity_img: '',
        activity_participation: ''
      },
      searchParam: {
        activity_place: '',
        activity_time: ''
      },
      addEditPlanning: false,
      addEditModal: false,
      viewDetails: false,
      viewDetailsPlanning: false,
      EditPlanning: false,
      AllDetailsInfo: false,
      currentpageNo: 1,
      currentpageSize: 10,
      totalnum: 0,
      totalnum2: 0,
      tab_index: 0,
      columns1: [
        {
          title: '序号',
          type: 'index',
          width: 60,
          align: 'center'

        },
        {
          title: '活动主题',
          key: 'activity_theme',
          align: 'center'
        },
        {
          title: '活动目的',
          key: 'activity_objective',
          align: 'center'
        },
        {
          title: '活动要求',
          key: 'activity_requirement',
          align: 'center'
        },
        {
          title: '操作',
          slot: 'action',
          align: 'center'
        }
      ],
      columns2: [
        {
          title: '序号',
          type: 'index',
          width: 60,
          align: 'center'

        },
        {
          title: '活动时间',
          key: 'activity_time',
          align: 'center',
          width: '150'

        },
        {
          title: '活动地点',
          key: 'activity_place',
          align: 'center'

        },
        {
          title: '参与人员范围',
          key: 'activity_object',
          align: 'center'
        },
        {
          title: '活动状态',
          slot: 'state',
          align: 'center',
          width: '150'
        },
        {
          title: '活动总结状态',
          slot: 'activity_state',
          align: 'center',
          width: '150'
        },
        {
          title: '操作',
          slot: 'action',
          align: 'center'
        }
      ],
      datalist1: [],
      datalist2: [],
      PersonList: [
        {
          value: '10-20岁人群',
          label: '10-20岁人群'
        },
        {
          value: '20-30岁人群',
          label: '20-30岁人群'
        },
        {
          value: '30-40岁人群',
          label: '30-40岁人群'
        },
        {
          value: '40-50岁人群',
          label: '40-50岁人群'
        },
        {
          value: '50-60岁人群',
          label: '50-60岁人群'
        }
      ],
      objectList: [],
      time: '',
      activity_img: '',
      visible: false,
      uploadList: [],
      PlanList: []
    }
  },
  methods: {
    // 添加策划按钮
    addPlanningButton (row) {
      this.formItem.id = row.id
      console.log(this.formItem.id, 'planid')
      this.formItem.activity_theme = row.activity_theme
      this.addModalPlanning = true
      this.formItemPlanning = {}
    },
    // 活动计划保存活动策划
    savePlanning () {
      this.formItemPlanning.activity_time = date0str(this.formItemPlanning.activity_time)
      let param = {
        plan_id: this.formItem.id,
        activity_time: this.formItemPlanning.activity_time,
        activity_place: this.formItemPlanning.activity_place,
        activity_object: this.objectList.join(','),
        emergency_measure: this.formItemPlanning.emergency_measure,
        activity_flow: this.formItemPlanning.activity_flow
      }
      addPlanningButton(param).then(ret => {
        if (ret.data.errcode === 0) {
          this.$Notice.success({
            title: '保存成功'
          })
        } else {
          this.$Notice.error({
            title: '保存失败'
          })
        }
      })
      this.addModalPlanning = false
      this.initAgent(this.formItemPlanning)
      this.objectList = []
    },
    // 上传图片
    handleView (url) {
      this.activity_img = url
      this.visible = true
    },
    handleRemove (file) {
      const fileList = this.uploadList
      this.uploadList.splice(fileList.indexOf(file), 1)
    },
    handleSuccess (res, file) {
      file.url = res.url
      file.name = res.title
      this.formSummary.activity_img = file.url
    },
    handleFormatError (file) {
      this.$Notice.warning({
        title: '文件格式不正确',
        desc: '文件格式' + file.name + ' 不正确,请选择jpg或png.'
      })
    },
    handleMaxSize (file) {
      this.$Notice.warning({
        title: '超出文件大小限制',
        desc: '文件  ' + file.name + ' 太大，不能超过2M.'
      })
    },
    handleBeforeUpload () {
      const check = this.uploadList.length < 1
      if (!check) {
        this.$Notice.warning({
          title: '最多可以上传1张图片'
        })
      }
      return check
    },
    // 保存编辑活动总结
    SaveActivityDetail (param) {
      console.log(param.activity_img, 'baocuntupian')
      SaveActivitySummary(param).then(ret => {
        if (ret.data.errcode === 0) {
          this.formSummary = {}
          this.$Modal.success({
            title: '保存成功！'
          })
          this.initAgent(this.formItemPlanning)
        } else {
          this.$Modal.error({
            title: '保存失败！'
          })
        }
      })
      this.viewDetailsPlanning = false
    },
    // 结束活动策划
    EndOfActivity (row) {
      this.$Modal.confirm({
        title: '确认要结束活动？',
        onOk: () => {
          let param = { id: row.id }
          updateActivityPlanning(param).then(ret => {
            if (ret.data.errcode === 0) {
              this.initAgent(this.formItemPlanning)
            } else {
              this.$Notice.error({
                title: '操作失败！'
              })
            }
          })
        }
      })
    },
    // 查看活动策划总结详情
    ViewAllDetails (row) {
      this.AllDetailsInfo = true
      this.formItemPlanning.activity_time = row.activity_time
      this.formItemPlanning.activity_flow = row.activity_flow
      this.formItemPlanning.activity_place = row.activity_place
      this.formItemPlanning.activity_object = row.activity_object
      this.formItemPlanning.emergency_measure = row.emergency_measure
      this.formSummary.activity_process = row.activity_process
      this.formSummary.activity_img = row.activity_img
      this.formSummary.activity_participation = row.activity_participation
      this.formSummary.planning_id = row.planning_id
      this.formSummary.id = row.acas_id
    },
    // 提交总结
    submitSummary (data) {
      if (data.planning_id !== undefined && data.activity_img !== undefined && data.activity_process !== undefined && data.activity_participation !== undefined) {
        let a = {
          id: data.planning_id,
          planning_id: data.planning_id,
          activity_img: data.activity_img,
          activity_participation: data.activity_participation,
          activity_process: data.activity_process
        }
        getActivityPlanning(a).then(ret => {
          if (ret.data.errcode === 0) {
            this.$Modal.success({
              title: '提交成功！'
            })
          } else {
            this.$Modal.error({
              title: '请重新核对信息'
            })
          }
          this.viewDetailsPlanning = false
          this.initAgent(this.formItemPlanning)
        })
      } else {
        this.$Modal.error({
          title: '输入内容不能为空'
        })
      }
    },
    // 初始化表格
    init (params) {
      getActivityPlanList(params).then(ret => {
        this.datalist1 = ret.data.data.results
        this.totalnum = ret.data.data.totalRecord
      })
    },
    initAgent (param) {
      getActivityPlanningList(param).then(ret => {
        this.datalist2 = ret.data.data.results
        this.totalnum2 = ret.data.data.totalRecord
      })
      findThemeList(param).then(ret => {
        this.PlanList = ret.data.data
        /* ret.data.data.forEach((item, index) => {
            let obj = {
              value: item.id,
              label: item.activity_theme
            }
            this.PlanList.push(obj)
          }) */
      })
    },
    // 添加活动计划
    add () {
      this.addEditModal = true
      this.formItem = {}
      this.modalTitle = '添加活动计划'
    },
    // 添加/编辑保存活动计划
    handleSubmit () {
      let a = { 'id': this.id,
        activity_theme: this.formItem.activity_theme,
        activity_objective: this.formItem.activity_objective,
        activity_requirement: this.formItem.activity_requirement }
      addEditActivityPlan(a).then(ret => {
        let result = ret.data
        if (result.errcode === 0) {
          this.$Modal.success({
            title: '保存成功'
          })
        } else {
          this.$Modal.error({
            title: '保存失败'
          })
        }
      })
      this.addEditModal = false
      this.init(this.formItem)
    },
    // 编辑活动计划
    edit (row, index) {
      this.modalTitle = '编辑活动计划'
      this.id = row.id
      this.formItem.activity_theme = row.activity_theme
      this.formItem.activity_objective = row.activity_objective
      this.formItem.activity_requirement = row.activity_requirement
      this.addEditModal = true
    },
    // 查看活动详情
    select (row) {
      console.log(row, 'chakanxiangqing')
      this.viewDetails = true
      this.formItem.activity_theme = row.activity_theme
      this.formItem.activity_requirement = row.activity_requirement
      this.formItem.activity_objective = row.activity_objective
      this.formItem.activity_content = row.activity_content
    },
    // 查询活动计划
    selectPlan (formItem) {
      if (formItem !== '') {
        let param = { activity_theme: formItem }
        getActivityTheme(param).then(ret => {
          if (ret.data.errcode === 0) {
            this.datalist1 = ret.data.data
          } else {
            this.$Notice.error({
              title: '操作失败'
            })
          }
        })
      } else if (formItem === '' || formItem === null) {
        this.init()
      }
    },
    // 添加活动策划
    addPlanning () {
      this.addEditPlanning = true
      this.formItemPlanning = {}
      this.modalPlanning = '添加活动策划'
    },
    // 编辑活动策划
    editPlanning (row, index) {
      this.addEditPlanning = true
      this.modalPlanning = '修改活动策划'
      this.ids = row.id
      this.formItemPlanning.plan_id = row.plan_id
      this.formItemPlanning.activity_time = row.activity_time
      this.formItemPlanning.activity_place = row.activity_place
      this.objectList = row.activity_object.split(',')
      this.formItemPlanning.emergency_measure = row.emergency_measure
      this.formItemPlanning.activity_flow = row.activity_flow
    },
    // 添加/编辑策划保存
    handleSubmitPlanning () {
      this.formItemPlanning.activity_time = date0str(this.formItemPlanning.activity_time)
      let data = { 'id': this.ids,
        plan_id: this.formItemPlanning.plan_id,
        activity_time: this.formItemPlanning.activity_time,
        activity_place: this.formItemPlanning.activity_place,
        activity_object: this.objectList.join(','),
        emergency_measure: this.formItemPlanning.emergency_measure,
        activity_flow: this.formItemPlanning.activity_flow
      }
      addEditActivityPlanning(data).then(ret => {
        let result = ret.data
        if (result.errcode === 0) {
          this.$Notice.success({
            title: '保存成功'
          })
        } else {
          this.$Notice.error({
            title: '保存失败'
          })
        }
        this.addEditPlanning = false
        this.initAgent(this.formItemPlanning)
      })
    },
    // 搜索活动策划
    selectPlanning (formItemPlanning) {
      this.searchParam.activity_time = date2str(this.searchParam.activity_time)
      if (formItemPlanning !== '') {
        let param = { activity_place: formItemPlanning.activity_place,
          activity_time: this.searchParam.activity_time }
        getActivityPlaceList(param).then(ret => {
          if (ret.data.errcode === 0) {
            this.datalist2 = ret.data.data
          } else {
            this.$Notice.error({
              title: '操作失败'
            })
          }
        })
      } else if (formItemPlanning === '') {
        this.initAgent(param)
      }
    },
    // 总结按钮功能
    planningDetails (row) {
      this.formSummary.activity_process = ''
      this.formSummary.activity_img = ''
      this.formSummary.activity_participation = ''
      if (row.acas_id !== undefined) {
        let data = { id: row.acas_id }
        getActivitySummaryList(data).then(ret => {
          this.formSummary.planning_id = ret.data.data[0].planning_id
          this.formSummary.activity_process = ret.data.data[0].activity_process
          this.formSummary.activity_img = ret.data.data[0].activity_img
          this.formSummary.activity_participation = ret.data.data[0].activity_participation
          this.viewDetailsPlanning = true
        })
      } else {
        this.formSummary.planning_id = row.id
        this.formItemPlanning.state = row.state
        this.viewDetailsPlanning = true
      }
    },
    // 执行活动策划
    Implement (row) {
      if (row !== '' || row !== null) {
        this.$Modal.confirm({
          title: '确认要执行活动？',
          onOk: () => {
            let param = { 'id': row.id }
            updatePlanningState(param).then(ret => {
              if (ret.data.errcode === 0) {
                this.initAgent(this.formItemPlanning)
              } else {
                this.$Notice.error({
                  title: '操作失败！'
                })
              }
            })
          }
        })
      }
    },
    // 计划分页
    change (pageNo) {
      let params = {
        pageNo: pageNo,
        pageSize: this.currentpageSize
      }
      this.init(params)
    },
    // 策划分页
    changeAgent (pageNo) {
      let params = {
        pageNo: pageNo,
        pageSize: this.currentpageSize
      }
      this.initAgent(params)
    },
    // 切换tab页
    changeTab (name) {
      this.currentPageNo = 1
      this.currentpageSize = 10
      console.log(this.tab_index, 'tab页')
      var param = {
        pageNo: this.currentPageNo,
        pageSize: this.currentpageSize,
        type: this.tab_index
      }
      if (this.tab_index === 0) {
        this.init(param)
      } else if (this.tab_index === 1) {
        this.initAgent(param)
      }
    },
    // 查看活动策划详情
    ViewPlanningDetails (row) {
      this.PlanningDetails = true
      this.formItemPlanning.activity_time = row.activity_time
      this.formItemPlanning.activity_place = row.activity_place
      this.formItemPlanning.activity_object = row.activity_object.split(',')
      this.formItemPlanning.emergency_measure = row.emergency_measure
      this.formItemPlanning.activity_flow = row.activity_flow
    },
    // 查看总结详情
    ViewSummaryDetails (row) {
      if (row.activity_process !== undefined && row.activity_img !== undefined && row.activity_participation !== undefined) {
        this.SummaryDetails = true
        this.formSummary.activity_process = row.activity_process
        this.formSummary.activity_img = row.activity_img
        this.formSummary.activity_participation = row.activity_participation
      } else {
        this.$Modal.error({
          title: '请填写总结信息'
        })
      }
    }
  },
  filters: {
    formatDate: function (value) {
      let date = new Date(value)
      let y = date.getFullYear()
      let MM = date.getMonth() + 1
      MM = MM < 10 ? ('0' + MM) : MM
      let d = date.getDate()
      d = d < 10 ? ('0' + d) : d
      return y + '-' + MM + '-' + d
    }
  },
  mounted () {
    this.uploadList = this.$refs.upload.fileList
    // this.init(this.formItem)
    // this.initAgent(this.formItemPlanning)
  }
}
</script>
